<template>
  <div
    class="description_container wow"
    :class="animation.animationR"
    :data-wow-duration="animation.durationR+'s'"
    :data-wow-delay="animation.delayR+'s'"
    @click="checkDetail(insertData)">
    <div>
      <p class="description_title">{{insertData.title}}</p>
      <div class="description_info">
        <span
          v-for="(value, index) in Object.keys(insertData)"
          :key="index" v-if="cardFieldList[value]">{{cardFieldList[value] + '：' + insertData[value]}}</span>
      </div>
    </div>
    <div>
      <i class="iconfont icon-arrow_lien_right"></i>
    </div>
  </div>
</template>

<script>
import stepFieldList from './stepFieldList'
export default {
  name: 'DescriptionCard',
  props: {
    animation: {
      type: Object
    },
    insertData: {
      type: Object
    }
  },
  data() {
    return {
      cardFieldList: stepFieldList
    }
  },
  methods: {
    checkDetail(item) {
      this.$emit('checkDetail', item)
    }
  }
}
</script>

<style scoped>

</style>
